<template>
  <div class="about-container">
   <div class="item avatar">
     <van-image width="100" height="100" round src="https://img01.yzcdn.cn/vant/cat.jpeg"></van-image>
   </div>
   <div class="item author">
    <p>项目作者: <span class="label">{{auth.userInfo.author}}</span></p>
    <p style="margin-top:10px">标签：<span class="label">{{auth.userInfo.label}}</span></p>
   </div>
   <div class="item author">
     <p>微信授权的AppID：<span class="label">{{auth.AppID}}</span></p>
   </div>
   <div class="item url">
     <p class="address">项目地址</p>
     <p>{{auth.userInfo.projectAddress}}</p>
   </div>
  </div>
</template>
<script setup lang="ts">
import { getUserInfo } from '@/api/authController'
import { useAuthStore } from '@/store/auth' // 'useAuthStore' is declared but its value is never read

   // const userInfo = ref({}) 此处写法错误，运行时正常展示，但是npm run build时报错不通过
   const auth = useAuthStore()

   const initData = async () => {
      const result = await getUserInfo()
      if (result.code !== 0) return new Error(result.msg)
		  auth.saveUserInfo({...result.data,label:'一枚前端程序猿'})
      // userInfo.value = auth.userInfo 此处写法错误，运行时正常展示，但是npm run build时报错不通过
      
   }

   onMounted(() => {
     initData()
   })

</script>
<style lang="scss" scoped>
 .about-container {
   	height: 100vh;
	  @include flexbox(flex-start, center, column);
    .item {
      margin: 15px 0;
      text-align: center;
	  }
    .author {
		  font-size: 16px;
	  }
    .label {
      color: #4ca9f2;
      font-size: 14px;
    }
    .url {
      color: #4ca9f2;
      font-size: 14px;
      .address {
        text-align: center;
        margin-bottom: 10px;
      }
	}
 }


</style>
